<template>
	<view class="custom-navbar">
		<u-navbar :safeAreaInsetTop="true" :autoBack="true" :placeholder="true" :fixed="false" @rightClick="save">
			<view class="navbar-left" slot="left" @click="back">返回</view>
			<view class="navbar-center" slot="center">{{name}}</view>
			<view class="navbar-right" slot="right">
				<view class="flex-no-horizontal" :class="{'change-style':isChange}">保存</view>
			</view>
		</u-navbar>
	</view>
</template>
<script>
	export default {
		props:{
			name:{
				type:String
			},
			isChange:{
				type:Boolean,
				default:false
			}
		},
		data() {
			return {

			}
		},
		methods: {
			save() {
				this.$emit('saveHandleClick')
			}
		},
		created() {
			// console.log(this.isChange)
		}
	}
</script>

<style lang="scss">
.custom-navbar ::v-deep	.u-navbar__content__right{
		padding:0 4rpx ;
	}
.navbar-right {
		justify-content: center;
		view {
			width: 145rpx;
			height: 60rpx;
			font-size: 28rpx;
			color: #A7A7A7;
			background: #F7F7F7;
			border-radius: 30rpx;
			justify-content: center;
		}
		.change-style{
			background: #4ABC5A;
			color:#FFF;
			width: 145rpx;
			height: 60rpx;
			border-radius: 30rpx;
			font-size: 28rpx;
			justify-content: center;
		}
	}
	.navbar-center{
		font-size: 32rpx;
		font-family: PingFang SC;
		font-weight: bold;
	}
	.navbar-left{
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #000000;
	}
</style>
